Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore(v0): enable emit only dts and use new conformance test API to narrow down TS Program #27686

Merged
merged 5 commits into from
Apr 27, 2023
Merged

chore(v0): enable emit only dts and use new conformance test API to narrow down TS Program #27686

merged 5 commits into from
Apr 27, 2023
+46 −31

Conversation

Hotell
Copy link
Contributor

@Hotell Hotell commented Apr 25, 2023 •
edited
Loading

New Behavior

typescript

v0 uses solely babel for transpilation thus tsc is doing unnecessary work.
TSC only purpose is type checking and emmiting declaration files.

This give use approx 10% speed bump as well.

tests tweaks:

  1. By leveraging new conformance API(feat(react-conformance): add new TS config api to be able to specify configName and configDir #27664) we get following speed bump

NOTE: metrics from local machine - M1 pro 10 Cores, on CI it's using maxWorkers 2 so its much slower

Run type (yarn workspace @fluentui/react-northstar jest --no-cache) time delta
current 150s
with new conformance api 144s 4%
  1. enabling mock resets to prevent accidental leaks
  2. narrowing down fake timers usage

Related Issue(s)

@github-actions github-actions bot added this to the April Project Cycle Q2 2023 milestone Apr 25, 2023
@Hotell Hotell mentioned this pull request Apr 25, 2023
Open
9 tasks
@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 25, 2023 •
edited
Loading

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 24a87ed:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@size-auditor
Copy link

size-auditor bot commented Apr 25, 2023 •
edited
Loading

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 1998266417c387820d4020bc72e2bc74dc1e48c7 (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 25, 2023 •
edited
Loading

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
InfoButton mount 15 21 5000 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 718 680 5000
Button mount 374 357 5000
Field mount 1283 1279 5000
FluentProvider mount 896 892 5000
FluentProviderWithTheme mount 106 123 10
FluentProviderWithTheme virtual-rerender 103 95 10
FluentProviderWithTheme virtual-rerender-with-unmount 105 107 10
InfoButton mount 15 21 5000 Possible regression
MakeStyles mount 1139 1137 50000
Persona mount 2037 1988 5000
SpinButton mount 1566 1525 5000

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 25, 2023 •
edited
Loading

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AccordionMinimalPerf.default 106 94 1.13:1
IconMinimalPerf.default 482 435 1.11:1
PortalMinimalPerf.default 120 111 1.08:1
CarouselMinimalPerf.default 355 331 1.07:1
ButtonMinimalPerf.default 109 103 1.06:1
HeaderMinimalPerf.default 274 258 1.06:1
SkeletonMinimalPerf.default 253 239 1.06:1
BoxMinimalPerf.default 249 237 1.05:1
CardMinimalPerf.default 390 372 1.05:1
VideoMinimalPerf.default 526 501 1.05:1
DropdownManyItemsPerf.default 501 483 1.04:1
TableManyItemsPerf.default 1450 1397 1.04:1
ButtonSlotsPerf.default 409 399 1.03:1
ChatMinimalPerf.default 543 527 1.03:1
ListMinimalPerf.default 390 379 1.03:1
RefMinimalPerf.default 145 141 1.03:1
StatusMinimalPerf.default 512 499 1.03:1
TextMinimalPerf.default 256 248 1.03:1
TreeWith60ListItems.default 111 108 1.03:1
AnimationMinimalPerf.default 370 361 1.02:1
ImageMinimalPerf.default 286 280 1.02:1
RosterPerf.default 1870 1829 1.02:1
CustomToolbarPrototype.default 1909 1874 1.02:1
TooltipMinimalPerf.default 1646 1621 1.02:1
AttachmentSlotsPerf.default 835 827 1.01:1
CheckboxMinimalPerf.default 1580 1566 1.01:1
DatepickerMinimalPerf.default 4522 4497 1.01:1
DialogMinimalPerf.default 575 570 1.01:1
DropdownMinimalPerf.default 1816 1796 1.01:1
EmbedMinimalPerf.default 2402 2384 1.01:1
FlexMinimalPerf.default 201 199 1.01:1
InputMinimalPerf.default 720 712 1.01:1
LabelMinimalPerf.default 285 282 1.01:1
MenuMinimalPerf.default 624 615 1.01:1
MenuButtonMinimalPerf.default 1259 1252 1.01:1
RadioGroupMinimalPerf.default 327 324 1.01:1
TreeMinimalPerf.default 591 583 1.01:1
ButtonOverridesMissPerf.default 827 829 1:1
FormMinimalPerf.default 277 276 1:1
ItemLayoutMinimalPerf.default 911 908 1:1
LayoutMinimalPerf.default 261 262 1:1
PopupMinimalPerf.default 447 445 1:1
ProviderMergeThemesPerf.default 969 966 1:1
ReactionMinimalPerf.default 270 270 1:1
SegmentMinimalPerf.default 251 251 1:1
SplitButtonMinimalPerf.default 3005 3000 1:1
ToolbarMinimalPerf.default 658 659 1:1
DividerMinimalPerf.default 252 254 0.99:1
GridMinimalPerf.default 239 241 0.99:1
SliderMinimalPerf.default 908 920 0.99:1
TableMinimalPerf.default 298 301 0.99:1
HeaderSlotsPerf.default 572 582 0.98:1
ListCommonPerf.default 485 494 0.98:1
ListNestedPerf.default 398 405 0.98:1
ProviderMinimalPerf.default 271 276 0.98:1
AlertMinimalPerf.default 194 199 0.97:1
ListWith60ListItems.default 472 485 0.97:1
LoaderMinimalPerf.default 236 244 0.97:1
TextAreaMinimalPerf.default 339 350 0.97:1
AvatarMinimalPerf.default 133 139 0.96:1
ChatWithPopoverPerf.default 239 249 0.96:1
ChatDuplicateMessagesPerf.default 181 195 0.93:1
AttachmentMinimalPerf.default 92 102 0.9:1

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 25, 2023 •
edited
Loading

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext		 533 B
341 B
global-context
createContextSelector		 560 B
352 B
priority-overflow
createOverflowManager		 3.194 kB
1.314 kB
react-accordion
Accordion (including children components)		 86.012 kB
26.086 kB
react-alert
Alert		 93.779 kB
22.493 kB
react-avatar
Avatar		 57.544 kB
14.966 kB
react-avatar
AvatarGroup		 15.632 kB
6.258 kB
react-avatar
AvatarGroupItem		 73.758 kB
19.478 kB
react-badge
Badge		 23.512 kB
7.197 kB
react-badge
CounterBadge		 24.416 kB
7.506 kB
react-badge
PresenceBadge		 31.904 kB
8.296 kB
react-button
Button		 37.179 kB
9.534 kB
react-button
CompoundButton		 44.328 kB
11.016 kB
react-button
MenuButton		 41.866 kB
10.861 kB
react-button
SplitButton		 50.254 kB
12.441 kB
react-button
ToggleButton		 55.397 kB
11.435 kB
react-card
Card - All		 86.061 kB
24.345 kB
react-card
Card		 80.997 kB
22.895 kB
react-card
CardFooter		 9.158 kB
3.844 kB
react-card
CardHeader		 11.048 kB
4.538 kB
react-card
CardPreview		 9.963 kB
4.192 kB
react-checkbox
Checkbox		 34.216 kB
10.784 kB
react-combobox
Combobox (including child components)		 87.199 kB
28.095 kB
react-combobox
Dropdown (including child components)		 85.583 kB
27.692 kB
react-components
react-components: Button, FluentProvider & webLightTheme		 65.31 kB
17.931 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover		 204.34 kB
57.141 kB
react-components
react-components: FluentProvider & webLightTheme		 36.086 kB
11.9 kB
react-datepicker-compat
DatePicker Compat		 220.251 kB
58.471 kB
react-dialog
Dialog (including children components)		 90.867 kB
27.047 kB
react-divider
Divider		 17.399 kB
6.298 kB
react-field
Field		 18.864 kB
7.004 kB
react-image
Image		 11.479 kB
4.573 kB
react-infobutton
InfoButton		 127.925 kB
39.003 kB
react-infobutton
InfoLabel		 131.208 kB
39.996 kB
react-input
Input		 23.972 kB
7.676 kB
react-label
Label		 10.104 kB
4.185 kB
react-link
Link		 12.357 kB
5.091 kB
react-menu
Menu (including children components)		 128.202 kB
39.18 kB
react-menu
Menu (including selectable components)		 131.186 kB
39.696 kB
react-overflow
hooks only		 11.214 kB
4.271 kB
react-persona
Persona		 64.465 kB
16.892 kB
react-popover
Popover		 114.917 kB
35.388 kB
react-portal
Portal		 11.649 kB
4.262 kB
react-portal-compat
PortalCompatProvider		 6.446 kB
2.186 kB
react-positioning
usePositioning		 24.008 kB
8.798 kB
react-progress
ProgressBar		 13.856 kB
5.434 kB
react-provider
FluentProvider		 18.033 kB
6.666 kB
react-radio
Radio		 27.282 kB
8.661 kB
react-radio
RadioGroup		 11.312 kB
4.71 kB
react-select
Select		 25.357 kB
8.798 kB
react-slider
Slider		 34.112 kB
11.018 kB
react-spinbutton
SpinButton		 33.882 kB
10.325 kB
react-spinner
Spinner		 20.882 kB
6.798 kB
react-switch
Switch		 29.806 kB
9.274 kB
react-table
DataGrid		 147.659 kB
40.567 kB
react-table
Table (Primitives only)		 44.348 kB
12.347 kB
react-table
Table as DataGrid		 130.218 kB
33.128 kB
react-table
Table (Selection only)		 78.132 kB
19.127 kB
react-table
Table (Sort only)		 77.462 kB
18.939 kB
react-text
Text - Default		 12.492 kB
4.92 kB
react-text
Text - Wrappers		 15.624 kB
5.232 kB
react-textarea
Textarea		 27.399 kB
9.041 kB
react-theme
Single theme token import		 69 B
89 B
react-theme
Teams: all themes		 31.33 kB
6.764 kB
react-theme
Teams: Light theme		 17.895 kB
5.162 kB
react-tooltip
Tooltip		 46.656 kB
16.369 kB
react-utilities
SSRProvider		 180 B
159 B
🤖 This report was generated against 1998266417c387820d4020bc72e2bc74dc1e48c7

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 25, 2023 •
edited
Loading

🕵 fluentuiv9 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 25, 2023 •
edited
Loading

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 842 817 5000
Breadcrumb mount 2216 2306 1000
Checkbox mount 2149 2144 5000
CheckboxBase mount 1887 1892 5000
ChoiceGroup mount 3742 3714 5000
ComboBox mount 875 881 1000
CommandBar mount 8187 8045 1000
ContextualMenu mount 16533 17047 1000
DefaultButton mount 984 985 5000
DetailsRow mount 2889 2876 5000
DetailsRowFast mount 2916 2905 5000
DetailsRowNoStyles mount 2629 2614 5000
Dialog mount 3455 3433 1000
DocumentCardTitle mount 314 317 1000
Dropdown mount 2546 2555 5000
FocusTrapZone mount 1519 1501 5000
FocusZone mount 1468 1467 5000
GroupedList mount 49465 57424 2
GroupedList virtual-rerender 23906 24021 2
GroupedList virtual-rerender-with-unmount 73746 74123 2
GroupedListV2 mount 333 316 2
GroupedListV2 virtual-rerender 305 302 2
GroupedListV2 virtual-rerender-with-unmount 323 313 2
IconButton mount 1369 1432 5000
Label mount 471 459 5000
Layer mount 3673 3610 5000
Link mount 516 515 5000
MenuButton mount 1201 1242 5000
MessageBar mount 27720 27935 5000
Nav mount 2510 2565 1000
OverflowSet mount 1011 1035 5000
Panel mount 2254 2270 1000
Persona mount 974 957 1000
Pivot mount 1176 1186 1000
PrimaryButton mount 1098 1104 5000
Rating mount 5720 5777 5000
SearchBox mount 1177 1125 5000
Shimmer mount 2339 2344 5000
Slider mount 1717 1702 5000
SpinButton mount 3759 3781 5000
Spinner mount 526 514 5000
SplitButton mount 2429 2438 5000
Stack mount 543 543 5000
StackWithIntrinsicChildren mount 1127 1122 5000
StackWithTextChildren mount 3222 3218 5000
SwatchColorPicker mount 8150 8013 5000
TagPicker mount 1946 1999 5000
Text mount 501 495 5000
TextField mount 1196 1216 5000
ThemeProvider mount 1127 1142 5000
ThemeProvider virtual-rerender 768 781 5000
ThemeProvider virtual-rerender-with-unmount 1729 1716 5000
Toggle mount 800 806 5000
buttonNative mount 289 303 5000

@Hotell Hotell changed the title chore(v0): emit dts only for v0 which uses babel for transpilation chore(v0): enable emit only dts and use new conformance test API to narrow down TS Program Apr 25, 2023
@Hotell Hotell force-pushed the hotell/build/faster-ci/v0-tsc-only-declaration branch from 3b89ae0 to 5913b99 Compare April 26, 2023 17:06
@Hotell Hotell marked this pull request as ready for review April 27, 2023 09:50
@Hotell Hotell requested review from a team as code owners April 27, 2023 09:50
@Hotell Hotell mentioned this pull request Apr 27, 2023
Closed
11 tasks
@tudorpopams tudorpopams self-requested a review April 27, 2023 12:12
@fabricteam
Copy link
Collaborator

🕵 fluentuiv8 No visual regressions between this PR and main

@Hotell Hotell merged commit 933b40d into microsoft:master Apr 27, 2023
@Hotell Hotell deleted the hotell/build/faster-ci/v0-tsc-only-declaration branch April 27, 2023 16:01
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request May 2, 2023
@marcosmoura
Merge branch 'master' into feat/drawer-header
fde52a5 
* master:
  applying package updates
  fix: dont ignore lib, lib-commonjs and lib-amd files (microsoft#27736)
  Add DraggableZone into export map (microsoft#27569)
  Add export for FolderCover.scss (microsoft#27507)
  applying package updates
  Add filetype icon for Microsoft Designer (microsoft#27724)
  ci: add build task back as lint pre-requirement to unblock temporarily import plugin lint rule (microsoft#27729)
  fix(react-charting): add missing dependency to fix lint violations during release (microsoft#27728)
  Added partition for controlled overflow menu (microsoft#27520)
  Azure Theme 8.0: Tag Button variant for DefaultButton and PrimaryButton (microsoft#27186)
  Azure Theme 8.0 dropdown fix for high contrast themes (microsoft#27346)
  chore: enable TS intellisense in cross library projects for better/consistent DX (microsoft#26605)
  chore: enforce files naming to use .styles.ts [cxe-red files] (microsoft#27710)
  chore(v0): enable emit only dts and use new conformance test API to narrow down TS Program (microsoft#27686)
  codeowner update (microsoft#27719)
  Tag/TagButton init component setup (microsoft#27102)
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request May 2, 2023
@marcosmoura
Merge branch 'feat/drawer-components' into feat/drawer-footer
5a4a3d1 
* feat/drawer-components: (120 commits)
  fix: add missing change file
  Component testing - Donut chart (microsoft#27033)
  fix: update .npmignore files to resolve npm8/node16 regression with npm publish for v9 packages (microsoft#27741)
  chore: add .swcrc to .npmignore (generator) (microsoft#27739)
  docs: update API
  Autogenerate react-toast package (microsoft#27730)
  applying package updates
  fix: dont ignore lib, lib-commonjs and lib-amd files (microsoft#27736)
  Add DraggableZone into export map (microsoft#27569)
  Add export for FolderCover.scss (microsoft#27507)
  applying package updates
  Add filetype icon for Microsoft Designer (microsoft#27724)
  ci: add build task back as lint pre-requirement to unblock temporarily import plugin lint rule (microsoft#27729)
  fix(react-charting): add missing dependency to fix lint violations during release (microsoft#27728)
  Added partition for controlled overflow menu (microsoft#27520)
  Azure Theme 8.0: Tag Button variant for DefaultButton and PrimaryButton (microsoft#27186)
  Azure Theme 8.0 dropdown fix for high contrast themes (microsoft#27346)
  chore: enable TS intellisense in cross library projects for better/consistent DX (microsoft#26605)
  chore: enforce files naming to use .styles.ts [cxe-red files] (microsoft#27710)
  chore(v0): enable emit only dts and use new conformance test API to narrow down TS Program (microsoft#27686)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@fabricteam fabricteam fabricteam left review comments

@layershifter layershifter layershifter approved these changes

@tudorpopams tudorpopams tudorpopams approved these changes

Assignees
No one assigned
Labels
Area: Testing Area: Typescript Fluent UI react-northstar (v0) Work related to Fluent UI V0
Projects
None yet
Milestone
April Project Cycle Q2 2023
Development

Successfully merging this pull request may close these issues.
5 participants
@Hotell @fabricteam @layershifter @tudorpopams @ling1726